<!--
 * @Author: 刘十三
 * @Date: 2024-01-04 13:02:36
 * @LastEditors: 刘十三
 * @LastEditTime: 2024-03-10 15:31:50
 * @FilePath: \NM-dev-1.3.1\dev\pages\internal\linkage\todo\informationEntry.vue
 * @Description: 内蒙多员联动 - 信息录入（列表）
-->

<template>
  <view class="page">
    <!-- #ifdef H5-ONLY -->
    <theme-navbar :is-white="false" :title="navTitle" :custom-back="goBack" style="z-index: 99999">
      <u-icon name="search" color="#FFF" size="38" style="margin: 0 24rpx 0 6rpx" @tap="openSearch"></u-icon>
      <u-icon name="plus" color="#FFF" size="38" style="margin: 0 24rpx 0 6rpx" @tap="handleAdd"></u-icon>
    </theme-navbar>
    <!-- #endif -->

    <!-- #ifdef H5-WECHAT -->
    <fab-button :content="fContent" @fabtrigger="fabtrigger" />
    <!-- #endif -->

    <!-- 列表 -->
    <view class="content">
      <me-table :i="0" :index="0" :top="20" :load-data="loadData" :init-load="false" ref="mescrollItem0" v-if="show">
        <template slot-scope="d">
          <u-swipe-action :index="d.index" :options="cardOptions" :key="d.index" @click="deliverClick" class="swipe-list" :disabled="d.data.processStatus != '01'" :show="contentList[d.index].showSwipe" @open="deliverOpen">
            <u-card :showHead="false" :showFoot="false" padding="20" :border="false" margin="0">
              <informationEntryItem slot="body" class="n-lay" :seal-info="d.data" />
            </u-card>
          </u-swipe-action>
        </template>
      </me-table>
    </view>

    <!-- 搜索条件 -->
    <u-popup v-model="searchVisable" width="80%" mode="right">
      <view class="cearch_title">
        查询条件
      </view>
      <u-form :model="serachForm" label-position="top" label-width="auto" style="padding: 80rpx 32rpx 0 32rpx" ref="uForm">
        <template v-if="searchVisable">
          <u-form-item label="检索内容:" prop="taskTitle">
            <u-input placeholder="请输入检索内容" :border="false" v-model="serachForm.taskQueryRequest.taskTitle" />
          </u-form-item>
          <u-form-item label="企业字号:" prop="retailerName">
            <u-input placeholder="请输入企业字号" :border="false" v-model="serachForm.taskQueryRequest.retailerName" />
          </u-form-item>
          <u-form-item label="反馈开始日期:" prop="feedbackDateStart">
            <z-date placeholder="请选择" v-model="serachForm.taskQueryRequest.feedbackDateStart" />
          </u-form-item>
          <u-form-item label="反馈结束日期:" prop="feedbackDateEnd">
            <z-date placeholder="请选择" v-model="serachForm.taskQueryRequest.feedbackDateEnd" />
          </u-form-item>
        </template>
      </u-form>
      <view class="submit-btns btn-other-cls">
        <u-button plain class="del" type="primary" @tap="handleRest">
          重置
        </u-button>
        <u-button class="mit" type="primary" @tap="selectChange">
          确定
        </u-button>
      </view>
    </u-popup>
  </view>
</template>

<script>
import { ZDate } from "@/components";
import meTable from "@/components/me-table.vue";
import fabButton from "@/components/uni-fab.vue";
import informationEntryItem from "./components/informationEntryItem.vue";
import MescrollMoreMixin from "@/components/mescroll-uni/mixins/mescroll-more.js";
import linkageService from "@/service/internal/linkeage.service";
export default {
  components: {
    ZDate,
    meTable,
    fabButton,
    informationEntryItem,
  },
  mixins: [MescrollMoreMixin],
  data() {
    return {
      show: true,
      contentList: [],
      searchVisable: false,
      serachForm: {
        page: 1,
        limit: 10,
        taskQueryRequest: {
          feedbackDateStart: "",
          feedbackDateEnd: "",
          retailerName: "",
          taskTitle: "",
        },
      },
      cardOptions: [
        {
          text: "编辑",
          style: {
            backgroundColor: "#007aff",
          },
        },
        {
          text: "删除",
          style: {
            backgroundColor: "#dd524d",
          },
        },
      ],
      fContent: [
        {
          iconPath: require("@/static/add.png"),
          selectedIconPath: require("@/static/add.png"),
          text: "新增",
          active: false,
        },
        {
          iconPath: require("@/static/search.png"),
          selectedIconPath: require("@/static/search.png"),
          text: "搜索",
          active: false,
        },
      ],
    };
  },
  methods: {
    openSearch() {
      this.searchVisable = true;
    },
    selectChange() {
      if (this.serachForm.taskQueryRequest.feedbackDateStart && this.serachForm.taskQueryRequest.feedbackDateEnd) {
        if (new Date(this.serachForm.taskQueryRequest.feedbackDateStart) > new Date(this.serachForm.taskQueryRequest.feedbackDateEnd)) {
          return this.$u.toast("反馈开始日期不能大于反馈结束日期");
        }
      }
      this.searchVisable = false;
      this.handleReferList();
    },
    handleRest() {
      this.serachForm.taskQueryRequest = {
        feedbackDateStart: "",
        feedbackDateEnd: "",
        retailerName: "",
        taskTitle: "",
      };
    },
    loadData(pager) {
      let self = this;
      this.serachForm.page = pager.num;
      this.serachForm.limit = pager.size;
      return new Promise((resolve) => {
        linkageService
          .getTaskClientList(self.serachForm)
          .then((res) => {
            if (res.success) {
              let list = res.data.map((item) => {
                return {
                  ...item,
                  showSwipe: false,
                };
              });
              this.contentList = list;
              resolve({
                data: this.contentList,
                count: res.count,
              });
            } else {
              self.$modal.alert(res.msg);
              resolve({
                data: [],
                count: 0,
              });
            }
          })
          .catch((err) => {
            resolve({
              data: [],
              count: 0,
            });
          });
      });
    },
    deliverOpen(index) {
      this.contentList[index] ? (this.contentList[index].showSwipe = true) : "";
      this.contentList.map((val, idx) => {
        if (index != idx) this.contentList[idx].showSwipe = false;
      });
    },
    deliverClick(index, btnIndex) {
      let list = this.$refs.mescrollItem0.listDatas;
      let processStatus = list[index].processStatus;
      this.deliverOpen(99999); // 无论编辑还是删除 都关闭swipe
      if (btnIndex == 0) {
        if (processStatus == "01") {
          this.$u.route({
            url: "/pages/internal/linkage/todo/informationEntryAddUpdate",
            type: "to",
            params: {
              id: list[index].id,
              operateType: "approve",
              isStatus: 1,
            },
          });
        } else {
          this.$u.toast("当前处于非草稿状态下，不可编辑");
        }
      } else {
        // 可以删除
        if (processStatus == "01") {
          let params = [list[index].id];
          this.$modal.confirm("确定要删除吗?", () => {
            linkageService.deleteTaskClientList(params).then((res) => {
              if (res.success) {
                this.$u.toast("删除成功");
                this.handleReferList();
              } else {
                this.$u.toast(res.msg);
              }
            });
          });
        } else {
          this.$u.toast("当前处于非草稿状态下，不可删除");
        }
      }
    },
    handleAdd() {
      this.$u.route({
        url: "/pages/internal/linkage/todo/informationEntryAddUpdate",
        type: "to",
        params: {
          isStatus: 0, // 0 新增 1编辑 2查看
          operateType: "approve",
        },
      });
    },
    fabtrigger(btn) {
      if (btn.index == 0) {
        this.handleAdd();
      } else {
        this.openSearch();
      }
    },
    updateBackState(param) {
      this.show = false;
      if (param.refresh) {
        setTimeout(() => {
          this.handleReferList();
        }, 300);
      }
    },
    handleReferList() {
      this.show = true;
      let mescroll = this.getMescroll(0);
      mescroll && mescroll.triggerDownScroll();
    },
  },
};
</script>

<style lang="scss" scoped>
.page {
  padding: 0;
}
.content {
  padding: 0 24rpx;
  background: #f5f5f5;
}
.swipe-list {
  background: #ffffff;
  margin-bottom: 24rpx;
  overflow: hidden;
  border-radius: 5px;
}
.swipe-list:last-child {
  margin: 0;
  /deep/ .u-card__body {
    padding-bottom: 0;
  }
}

.cearch_title {
  background-color: #f3f4f5;
  width: 100%;
  height: 82rpx;
  font-size: 32rpx;
  font-weight: 600;
  padding: 22rpx 0 21rpx 32rpx;
  z-index: 999;
  position: fixed;
}
</style>
